<!DOCTYPE html>
<html lang="en"><head>
    <title>Invoice using Bootstrap - mioInvoice Extended</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <!-- Bootstrap / Font Awesome / jQuery Autocomplete Styles -->
    <link href="a_data/bootstrap.css" rel="stylesheet">
    <link href="a_data/font-awesome.css" rel="stylesheet">

    <!-- Needed Assets -->
    <!-- Custom styles for our invoice -->
    <link href="a_data/styles.css" rel="stylesheet">
    <!-- Custom jQuery UI - Used for AutoComplete Menu Styles -->
    <link href="a_data/jquery-ui-1.css" rel="stylesheet">

    <link href="a_data/print.css" media="print" rel="stylesheet">

</head>

<body>

<!-- Top Navigation -->
<div class="navbar navbar-inverse navbar-fixed-top">
    <div class="container">
        <div class="navbar-header">
            <a class="navbar-brand" href="#">mioInvoice v2.0</a>
        </div>
        <div class="collapse navbar-collapse">
            <ul class="nav navbar-nav">
                <li class="active"><a href="http://www.codemashups.com/demo/mioinvoice-extended/index.php">Demo</a></li>
                <li><a href="http://www.codemashups.com/demo/mioinvoice-extended/documentation/index.html">Documentation</a></li>
            </ul>
        </div><!--/.nav-collapse -->
    </div>
</div><!-- End Nav -->

<!-- Wrap all page content here -->
<div id="wrap">


<div class="container page-header">



<form action="" method="post">


<input name="invId" value="" type="hidden">

<div class="row">
    <div class="col-md-6">
        <h4>Invoice # 4
            <input name="number" value="4" type="hidden">
        </h4>

        <div> May  8, 2014 </div>
        <h4 id="grandTotalTop">$</h4>
    </div>

    <div class="col-md-6 logoContainer">

        <div class="logo clearfix"><i class="icon-inbox"></i> mioInvoice 2.0</div>
        <div>Phone: (614) 555-9900</div>
        <div>info@mioInvoice.com</div>

    </div>
</div>

<hr>

<div class="row">

    <div class="col-md-6">

        <div id="clientName" class="edit required"></div>
        <input name="clientName" value="" type="hidden">

        <div id="clientAddress" class="edit"></div>
        <input name="clientAddress" value="" type="hidden">

        <div id="clientPostal" class="edit"></div>
        <input name="clientPostal" value="" type="hidden">

        <div id="clientPhone" class="edit"></div>
        <input name="clientPhone" value="" type="hidden">

    </div>

    <div class="col-md-6 companyInfo">
        <div><strong>mioInvoice, LLC</strong></div>
        <div>www.codemashups.com</div>
        <div>123 Company Road</div>
        <div>TheCity, State, Zip</div>
    </div>
</div>

<hr>

<div class="row">

    <div class="container">

        <table class="table table-striped table-condensed" id="itemsTable">

            <thead>
            <tr>
                <th style="width: 5%"></th>
                <th style="width: 15%">Item</th>
                <th style="width: 30%">Description</th>
                <th style="width: 10%">Qty</th>
                <th style="width: 20%">Price</th>
                <th style="width: 20%">Total</th>
            </tr>
            </thead>
            <tbody>
                            <tr class="item-row">

                    <td></td>
                    <td>
                        <input name="itemId[]" value="" id="itemId" type="hidden">

                        <input autocomplete="off" name="itemCode[]" class="form-control input-sm ui-autocomplete-input" id="itemCode" tabindex="1" type="text"><span class="ui-helper-hidden-accessible" aria-live="polite" role="status"></span>
                    </td>
                    <td><input name="itemDesc[]" class="form-control input-sm" id="itemDesc" readonly="readonly" type="text"></td>
                    <td><input name="itemQty[]" class="form-control input-sm" id="itemQty" tabindex="2" type="text">
                    </td>
                    <td>
                        <div class="input-group">
                            <span class="input-group-addon">$</span><input name="itemPrice[]" class="form-control input-sm" id="itemPrice" type="text"></div>
                    </td>
                    <td>
                        <div class="input-group">
                            <span class="input-group-addon">$</span><input name="itemLineTotal[]" class="form-control input-sm" id="itemLineTotal" readonly="readonly" type="text"></div>
                    </td>
                </tr><tr class="item-row"><td><i id="deleteRow" class="icon-remove"></i></td><td><input id="itemId" name="itemId[]" value="" type="hidden"><input autocomplete="off" id="itemCode" name="itemCode[]" class="form-control input-sm ui-autocomplete-input" type="text"><span class="ui-helper-hidden-accessible" aria-live="polite" role="status"></span> </td><td><input id="itemDesc" name="itemDesc[]" class="form-control input-sm" readonly="readonly" type="text"></td><td><input id="itemQty" name="itemQty[]" class="form-control input-sm" type="text"></td><td><div class="input-group"><span class="input-group-addon">$</span><input id="itemPrice" name="itemPrice[]" class="form-control input-sm" type="text"></div></td><td><div class="input-group"><span class="input-group-addon">$</span><input id="itemLineTotal" name="itemLineTotal[]" class="form-control input-sm" readonly="readonly" type="text"></div></td></tr>
            
            </tbody>
        </table>

        <a href="#" id="addRowBtn" class="btn btn-success"><i class="glyphicon glyphicon-plus"></i> Add Item</a>
        <input id="saveInvoiceBtn" class="btn btn-primary" name="saveInvoice" value="Save" type="submit">
        <a href="http://www.codemashups.com/demo/mioinvoice-extended/index.php" id="" class="btn btn-danger pull-right"><i class="glyphicon glyphicon-chevron-left"></i> Cancel</a>


    </div>
</div>

<hr>

<div class="row">

    <div class="col-md-7">
        <div class="alert alert-info notes">
            Thank you for choosing mioInvoice. We hope to do business with you again in the very near
            future!
        </div>
    </div>

    <div class="col-md-5 text-right">

        <div class="row">
            <div class="col-md-6 text-right"><h5>Sub Total:</h5></div>
            <div class="col-md-6 text-left"><h5 id="subTotal">$</h5>
            </div>
        </div>

        <div class="row">
            <div class="col-md-6 text-right">
                <div class="input-group">
                    <input placeholder="Sales Tax" name="tax" id="tax" class="form-control input-sm" type="text"><span class="input-group-addon">%</span></div>
            </div>
            <div class="col-md-6 text-left" id="salesTax"><h5>
                    $</h5></div>
        </div>

        <div class="row">
            <div class="col-md-6 text-right"><h4>Grand Total:</h4></div>
            <div class="col-md-6 text-left"><h4 id="grandTotal">
                    $
                </h4>
            </div>
        </div>
    </div>

</div>

</form>

</div>

<!-- Wrap all page content here -->
</div>

<div id="footer">
    <div class="container">
        <p class="muted credit">Damian Clem <a href="http://www.codemashups.com/">CodeMashups.com</a></p>
    </div>
</div>


<!-- jQuery libs -->
<script src="mioInvoice%20-%20PHP%20_%20jQuery%20Invoice%20Module%20Preview%20-%20CodeCanyon%20Archivos/ga.js" async="" type="text/javascript"></script><script type="text/javascript" src="a_data/jquery.js"></script>
<script src="a_data/bootstrap.js" type="text/javascript"></script>

<!-- Needed Assets -->
<!-- Our jQuery Script to make everything work -->
<script type="text/javascript" src="a_data/jquery-ui.js"></script>
<script type="text/javascript" src="a_data/mioinvoice-scripts.js"></script>
<script type="text/javascript" src="a_data/general-scripts.js"></script><ul style="z-index: 1; display: none;" tabindex="0" id="ui-id-1" class="ui-autocomplete ui-menu ui-widget ui-widget-content ui-corner-all"></ul>


<script type="text/javascript">

    var _gaq = _gaq || [];
    _gaq.push(['_setAccount', 'UA-11700128-9']);
    _gaq.push(['_trackPageview']);

    (function () {
        var ga = document.createElement('script');
        ga.type = 'text/javascript';
        ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0];
        s.parentNode.insertBefore(ga, s);
    })();

</script>

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title">Modal title</h4>

            </div>
            <div class="modal-body"><div class="te">

            </div></div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary">Save changes</button>
            </div>
        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>
<!-- /.modal -->




<ul style="z-index: 1; display: none;" tabindex="0" id="ui-id-2" class="ui-autocomplete ui-menu ui-widget ui-widget-content ui-corner-all"></ul></body></html>